<template>
  <div>
    <!-- 头 -->
    <div class="D7head">
      <img src="../assets/img/返回箭头.png" alt="" />
      <span>我的基金</span>
    </div>
    <!-- 钱数 -->
    <div class="D7money">
      <div class="D7money1">
        <p v-show="money">{{ mone1 }}</p>
        <p v-show="money1">{{ mone }}</p>
        <p>
          总金额(元) <span @click="eyes"> <img src="../assets/img/闭眼睛（灰色）.png" alt="" id="save-img"  v-show="eyetel"/>
          <img src="../assets/img/眼睛.png" alt="" v-show="!eyetel"> </span>
        </p>
        <p>
          买入待确认 <span v-show="money">{{ mone1 }}</span> <span v-show="money1">{{ mone }}</span> 元
        </p>
        <p>
          数据截至 <span>{{ time }}</span>
        </p>
      </div>
      <div class="D7money2">
        <div class="D7money21">
          <p>{{ yesterday }}</p>
          <p>昨日收益(元)</p>
        </div>
        <div class="D7money21">
          <p>{{ Holdingincome }}</p>
          <p>持有收益(元)</p>
        </div>
      </div>
    </div>
    <!-- 选项 -->
    <div class="D7options">
      <p class="D7options1">我的定投</p>
      <p class="D7options1">历史交易</p>
    </div>
    <div class="D7particulars">
      <div class="D7particulars1">当前交易中基金</div>
      <div
        class="D7particulars2"
        v-for="(item, index) in particulars"
        :key="index"
        @click="skip(item.fundName,item.bargainPrice,item.fund_id,item.buy_date,item.fundNumber )"
      >
        <div class="D7particulars21">
          <span>{{ item.fundName }}</span>
          <span>{{ item.fund_id }}</span>
        </div>
        <div class="D7particulars22">
          <span>{{item.bargainPrice}}</span>
          <span>{{item.buy_date}}</span>
          <span>{{ item.fundNumber }}</span>
        </div>
        <div class="D7particulars23">
          <span>交易金额(元)</span>
          <span>交易时间</span>
          <span>购买数量</span>
        </div>
        <div class="D7particulars24">
          <!-- <span>卡号</span> <span>{{ item.number }}</span> -->
        </div>
      </div>
    </div>
  </div>
</template>

<script>
// 接口
import { myfund } from "../api/MyFund";
export default {
  data() {
    return {
      mone: "",
      mone1:"*****",
      money:true,
      money1:false,
      eyetel: true ,
      particulars: [],
      time: "",
      yesterday:"0.00",
      Holdingincome:"0.00"
    };
  },

  methods: {
    eyes() {
      this.eyetel = !this.eyetel;
      if(this.eyetel ==true){
        this.money=true;
        this.money1=false;
      }else{
        this.money=false;
        this.money1=true;
      }
    },
    skip(name,money,number,time,sum) {
      console.log(name);
      this.$router.push({
        name: "TradingParticulars",
        params: {
          fundname: name,
          money:money,
          number:number,
          time:time,
          sum:sum
        },
      });
    },
    fundDetails1() {
      myfund({})
        .then((res) => {
          if (res.code == 200) {
            this.particulars = res.data;
            console.log(this.particulars);
            this.mone = res.map.money;
            this.time = res.map.time;
            console.log(res.map.money);
            console.log(res.data);
          }else{
            Dialog({title: '温馨提示', message: res.mag });
          }
        })
        .catch((err) => {
          console.log("失败");
        });
    },
  },
  created(){
    this.fundDetails1();
  }
};
</script>

<style src="../assets/css/MyFund.css">
</style>